<template>
    <div>
      <router-link :to="{path:'/home',query:{a:123,b:name}}">首页</router-link>
      <router-link :to="{name:'Home',query:{a:666,b:name}}">首页66</router-link>
      <!-- <router-link to="/home?a=555&b=666">首页</router-link> -->
      <router-link to='/home'>shouye</router-link>
      <router-link :to="{name:'About',params:{a:123,mykey:888}}">about页</router-link>
      <!-- <h1> -->
      <keep-alive include='Home'>
        <router-view></router-view>
      </keep-alive>
        
      <!-- </h1> -->
    </div>
</template>
<script>
// @ is an alias to /src
/* 
  router传参 两种方式 query   params
   query : :to={path:'/xxx',query:{传递的键值对}}
      获取的时候 可以通过this.$route.query

   params:  :to={name:'xxx',params:{传递的键值对}}  需要结合路由映射表使用
      {传递的键值对} 这里的坚持对 需要跟 路由映射表中的定义的属性名 保持一致
      获取的时候 可以通过this.$route.params
      to中的属性只能写name 不能写path

    this.$route   这里存储的都是属性
    this.$router  这里存储的都是方法
    、
    this.$router.push(参数)  参数等同于 to后边跟的内容
                 replace(参数等同于push)
                 go(2)
                 back  == go(-1)
    push 会产生新的浏览历史
    replace  是把当前的路径给替换了 它不会产生新的历史             
*/
export default {
    name: 'XXX',
    data() {
        return {
          name:"zhufeng"
        }
    },
    components: {
        
    }
}
</script>
<style lang="less">
  .router-link-active{
    color:blue
  }
  .current{
    color:blue
  }
</style>